<?xml version="1.0"?>

<f:view xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core"
        xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:p="http://primefaces.org/ui"
        xmlns:portlet="http://java.sun.com/portlet_2_0"  >

    <portlet:defineObjects />

    <h:head></h:head>

    <div  class="bookmarks-wrap">

      <h2 class="portlet-inner-title">
          Favoriter
      </h2>
      
      <!--Navigation between bookmark-list view and edit-bookmark view
      depending on if editBookmarkState in BookmarkBackingBean is true or false -->
      <p:panel id="bookmark_panel">

          <p:panel rendered="#{not bookmarkBackingBean.editBookmarkState}">
              <ui:include src="bookmark-list.xhtml"/>
          </p:panel>

          <p:panel rendered="#{bookmarkBackingBean.editBookmarkState}">
              <ui:include src="edit-bookmark.xhtml"/>
          </p:panel>
      </p:panel>
      <ui:include src="delete-dialog.xhtml"/></div>

    <!-- Alloy component used for toggle function in bookmark-list.xhtml -->
    <script type="text/javascript"
            src="#{facesContext.externalContext.requestContextPath}/js/bookmark-portlet.js"></script>
    <script type="text/javascript">

        AUI().ready('event', 'bookmark-portlet', function (A) {

            var rpBookmarkPortlet = new A.RpBookmarkPortlet({
                portletNamespace: '<portlet:namespace />',
                portletNode: '#p_p_id' + '#{facesContext.externalContext.response.namespace}'
            });
            rpBookmarkPortlet.render();
        });

    </script>

</f:view>
